<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    {% load static %}
	<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
	<title>天天生鲜-登录</title>
	<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">
	<link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">
</head>
{#图文ajax#}

{#不添加出不来#}
  <script src="{% static 'js/jquery-1.12.4.min.js' %}"></script>


<script>
    $(function () {
        //刷新
        //attr() 方法设置或返回被选元素的属性和值。
        //val() 方法返回或设置被选元素的 value 属性。
        $('.captcha').click(function () {
            $.getJSON('/df_user/img_refresh/',function (result) {
                    $('.captcha').attr('src',result['image_url']);
            $('#id_captcha_0').val(result['hashkey'])
            });
                return False
        });
    //验证
        //blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数。
    $('#id_captcha_1').blur(function () {
        console.log('用户输入的：'+$('#id_captcha_1').val());
        //获取输入框和隐藏字段id_captcha_0的值
        code=$('#id_captcha_1').val();
        hashkey=$('#id_captcha_0').val();
        $.getJSON('/df_user/img_check/',{'code':code,'hashkey':hashkey},
        function (res) {
            //1，验证码正确，0，错误
            {#alert('....验证结果'+res);#}
            if(res.status) {
                $('#msg').html('验证码正确')}
            else
                {$('#msg').html('验证码错误')}
        })
    })
    })
</script>
<body>
	<div class="login_top clearfix">
		<a href="index.html" class="login_logo"><img src="{% static 'images/logo02.png' %}"></a>
	</div>
	<div class="login_form_bg">
		<div class="login_form_wrap clearfix">
			<div class="login_banner fl"></div>
			<div class="slogan fl">日夜兼程 · 急速送达</div>
			<div class="login_form fr">
				<div class="login_title clearfix">
					<h1>用户登录</h1>
					<a href="#">立即注册</a>
				</div>
                <span id="msg"></span>
				<div class="form_input">
					<form method="post" action="">
                        {% csrf_token %}
						<input type="text" name="username" class="name_input" value="{{ username }}" placeholder="请输入用户名">
						<div class="user_error">输入错误</div>
						<input type="password" name="pwd" class="pass_input" placeholder="请输入密码">
						<div class="pwd_error">输入错误</div>
                        <div class="tuwen" style="position: absolute;margin-top: 120px">
{#							验证码:{{ register_form.captcha  }}#}
                            <img src="{{image_url}}" alt="" class="captcha" id="captcha">
                          <input autocomplete="off" id="id_captcha_1" name="code" type="text" placeholder="输入验证码" style="width:150px;float: right;height: 32px;margin-left: 15px;">
                          <input id="id_captcha_0"  type="hidden" name="hashkey" value="{{ hashkey }}">
                            <span id="msg"></span>
                        </div>
						<div class="more_input clearfix" style="position: absolute;top: 190px;">
							<input type="checkbox" name="remember" {{ checked }}>
							<label>记住用户名</label>
							<a href="#">忘记密码</a>
						</div>

						<input type="submit" name="" value="登录" class="input_submit" style="position: absolute;top: 230px;">
					</form>
                </div>
			</div>
		</div>
	</div>

	<div class="footer no-mp">
		<div class="foot_link">
			<a href="#">关于我们</a>
			<span>|</span>
			<a href="#">联系我们</a>
			<span>|</span>
			<a href="#">招聘人才</a>
			<span>|</span>
			<a href="#">友情链接</a>
		</div>
		<p>CopyRight © 2016 北京天天生鲜信息技术有限公司 All Rights Reserved</p>
		<p>电话：010-****888    京ICP备*******8号</p>
	</div>

</body>
</html>







{##}
{#{% extends 'base.html' %}#}
{#{% load static %}#}
{#{% block title %}天天生鲜-登录{% endblock %}#}
{#{% block topfiles %}#}
{#	<link rel="stylesheet" type="text/css" href="{% static 'css/reset.css' %}">#}
{#	<link rel="stylesheet" type="text/css" href="{% static 'css/main.css' %}">#}
{#{% endblock %}#}
{#{% block header_con %}{% endblock %}#}
{#{% block search_bar %}{% endblock %}#}
{#{% block body %}#}
{#	<div class="login_top clearfix">#}
{#		<a href="index.html" class="logo fl"><img src="{% static 'images/logo.png' %}"></a>#}
{#	</div>#}
{#	<div class="login_form_bg">#}
{#		<div class="login_form_wrap clearfix">#}
{#			<div class="login_banner fl"></div>#}
{#			<div class="slogan fl">日夜兼程 · 急速送达</div>#}
{#			<div class="login_form fr">#}
{#				<div class="login_title clearfix">#}
{#					<h1>用户登录</h1>#}
{#					<a href="#">立即注册</a>#}
{#				</div>#}
{#                <span id="msg"></span>#}
{#				<div class="form_input">#}
{#					<form method="post" action="">#}
{#                        {% csrf_token %}#}
{#						<input type="text" name="username" class="name_input" value="{{ username }}" placeholder="请输入用户名">#}
{#						<div class="user_error">输入错误</div>#}
{#						<input type="password" name="pwd" class="pass_input" placeholder="请输入密码">#}
{#						<div class="pwd_error">输入错误</div>#}
{#                        <div class="tuwen" style="position: absolute;margin-top: 120px">#}
{#							验证码:{{ register_form.captcha  }}#}
{##}
{#                            <img src="{{ image_url }}" alt="captcha" class="captcha" />#}
{#                            <input id="id_captcha_0" name="captcha_0" type="hidden" value="{{ hashkey }}" />#}
{#                            <input autocomplete="off" id="id_captcha_1" name="captcha_1" type="text" />#}
{#                            <span id="msg"></span>#}
{#                        </div>#}
{##}
{#						<div class="more_input clearfix" style="position: absolute;top: 190px;">#}
{#							<input type="checkbox" name="remember" {{ checked }}>#}
{#							<label>记住用户名</label>#}
{#							<a href="#">忘记密码</a>#}
{#						</div>#}
{##}
{#						<input type="submit" name="" value="登录" class="input_submit" style="position: absolute;top: 230px;">#}
{#					</form>#}
{#                </div>#}
{#			</div>#}
{#		</div>#}
{#	</div>#}
{#    {{ errmsg }}#}
{#{% endblock %}#}
{##}
{#{% block bottomfiles %}#}
{#    <script src="{% static 'js/jquery-1.12.4.min.js' %}"></script>#}
{#<script>#}
{#    $(function () {#}
{#        //刷新#}
{#        //attr() 方法设置或返回被选元素的属性和值。#}
{#        //val() 方法返回或设置被选元素的 value 属性。#}
{#        $('.captcha').click(function () {#}
{#            $.getJSON('/df_user/img_refresh/',function (result) {#}
{#                    $('.captcha').attr('src',result['image_url']);#}
{#            $('#id_captcha_0').val(result['hashkey'])#}
{#            });#}
{#                return False#}
{#        });#}
{#    //验证#}
{#        //blur() 方法触发 blur 事件，或规定当发生 blur 事件时运行的函数。#}
{#    $('#id_captcha_1').blur(function () {#}
{#        console.log('用户输入的：'+$('#id_captcha_1').val());#}
{#        //获取输入框和隐藏字段id_captcha_0的值#}
{#        code=$('#id_captcha_1').val();#}
{#        hashkey=$('#id_captcha_0').val();#}
{#        $.getJSON('/df_user/img_check/',{'code':code,'hashkey':hashkey},#}
{#        function (res) {#}
{#            //1，验证码正确，0，错误#}
            {#alert('....验证结果'+res);#}
{#            if(res.status) {#}
{#                $('#msg').html('验证码正确')}#}
{#            else#}
{#                {$('#msg').html('验证码错误')}#}
{#        })#}
{#    })#}
{#    })#}
{#</script>#}
{#{% endblock %}#}
{##}
